import React from 'react';
import util from 'util';
import {Table } from 'antd';
import {SearchDemo, RightButton, ColsEdit} from 'kpl';
import sys_dict from "sys_dict";
import $ from 'jquery';

class A201 extends React.Component {
    constructor(props) {
        super(props);
        this.state = {
            tblSource: [],
            searchParams: {
                rolename: "",
                roletype: "",
                descript: "",
                days:"1",
                "page": "1",
                "rows": sys_dict.defaultPageSize.toString()
            },
            totalCount: 0,
            isLoading: false
        }
    }

    componentDidMount() {
        let params = this.state.searchParams;
        this.refresh(params);
    }

    refresh(paramdic) {
        this.setState({isLoading: true});
        paramdic.select_begin_date = util.date2str(paramdic.select_begin_date);
        paramdic.select_end_date = util.date2str(paramdic.select_end_date);
        util.httpRequest({
            type: "POST", url: 'rank040001.json', params: paramdic, plattype: '', success: function (result) {
                if (result.ret_code == "0000") {
                    this.setState({
                        tblSource: result.employee_rank_list,
                        totalCount: result.counts
                    });
                }
            }.bind(this),
            complete: function () {
                this.setState({
                    isLoading: false
                })
            }.bind(this)
        });
    }

    search(params) {
        console.log(this);
        params.page = "1";
        params.rows = sys_dict.defaultPageSize.toString();
        this.setState({
            searchParams: params
        });
        this.refresh(params);
    }

    onShowSizeChange(current, pageSize) {
        console.log(current, pageSize);
        var params = this.state.searchParams;
        params.rows = pageSize;
        params.page = current;
        this.setState({searchParams: params});
        this.refresh(params);
    }

    onChange(page) {
        console.log(page);
        var params = this.state.searchParams;
        params.page = page;
        this.setState({searchParams: params});
        this.refresh(params);
    }
    
    
    getTableConfig(){
    	
         const pagination = {
            total: this.state.totalCount,
            showSizeChanger: true,
            showQuickJumper: true,
            pageSizeOptions: sys_dict.pageSizeOptions,
            defaultPageSize: sys_dict.defaultPageSize,
            onShowSizeChange: this.onShowSizeChange.bind(this),
            onChange: this.onChange.bind(this)
        };
		 let tableConfig={};
		 
		 tableConfig.queryConfig={ 

            searchTitle: "个人计步排行查询",
            searchInit: {
               
            },
            searchField: [
                [
                    {propsname: "员工姓名：", propsKey: "employee_name", propsType: "input", key: "1"},
                    {propsname: "时间：", propsKey: "days", propsType: "select", key: "2",optionData:[{itemkey:"1",itemval:"近1日"},{itemkey:"7",itemval:"近7日"},{itemkey:"30",itemval:"近30日"}]},
                ],
                //[
                //    {propsname: "开始时间：", propsKey: "select_begin_date", propsType: "datepicker", key: "2"},
                //    {propsname: "截止时间：", propsKey: "select_end_date", propsType: "datepicker", key: "3"}
                //]
            ]
        };
        
        tableConfig.resultConfig={
           pagination: pagination,
                loading: this.state.isLoading,
                dataSource: this.state.tblSource,
                columns: [{
                    title: '排名',
                    dataIndex: 'person_rank_no',
                    key: 'person_rank_no'
                }, {
                    title: '员工号',
                    dataIndex: 'employee_no',
                    key: 'employee_no'
                },{
                    title: '员工名称',
                    dataIndex: 'employee_name',
                    key: 'employee_name',
                }, {
                    title: '手机号',
                    dataIndex: 'phone',
                    key: 'phone'
                }, {
                    title: '团队名称',
                    dataIndex: 'group_name',
                    key: 'group_name'
                },  {
                    title: '小组名称',
                    dataIndex: 'sub_group_name',
                    key: 'sub_group_name'
                },{
                    title: '实际累计步数',
                    dataIndex: 'real_person_steps',
                    key: 'real_person_steps'
                },{
                    title: '封顶累计步数',
                    dataIndex: 'person_steps',
                    key: 'person_steps'
                }, {
                    title: '获点赞数',
                    dataIndex: 'person_likes',
                    key: 'person_likes'
                }]
        };
        
        
        return tableConfig;
    }

    

    handleCancel() {
        this.setState({
            modalVisible: false
        });
    }

   exportPersonalSteps(index){
       var parm = {};
       //var paramdic = this.state.searchParams;
       parm.year = "2017";
       parm.month = "08";
       //parm.begin_date = util.date2str(paramdic.select_begin_date);
       //parm.end_date = util.date2str(paramdic.select_end_date);
       //
       console.log('index'+index);
       if(index==1){
           util.exportRuquest(parm,'export/groupDetailSteps.json');
       }else if(index==2){
           util.exportRuquest(parm,'export/stepZeroEmployee.json');
       }else if(index==3){
           util.exportRuquest(parm,'export/groupValidSteps.json');
       }else {
           util.exportRuquest(parm,'export/nologinEmployee.json');
       }
   	}

    render() {
       
        let tableConfig = this.getTableConfig();
        return (
             <div>
            <SearchDemo search={this.search.bind(this)} searchConfig={tableConfig.queryConfig}></SearchDemo>
                <RightButton styleName="addBtn" propsKey="121" btnTxt="+  团队步数明细    " oprate={this.exportPersonalSteps.bind(this,1)}> </RightButton>
                 <RightButton styleName="addBtn" propsKey="122" btnTxt="+  步数为0的人数明细    " oprate={this.exportPersonalSteps.bind(this,2)}> </RightButton>
                 <RightButton styleName="addBtn" propsKey="123" btnTxt="+  有效步数排名    " oprate={this.exportPersonalSteps.bind(this,3)}> </RightButton>
                 <RightButton styleName="addBtn" propsKey="124" btnTxt="+  未登录人数明细    " oprate={this.exportPersonalSteps.bind(this,4)}> </RightButton>
                <Table {...tableConfig.resultConfig}></Table>
            </div>
        );
    }
}

export default A201;